<!-- 疾病详情页面 -->
<template>
  <TopNavigation leftText="疾病详情" />
  <view class="searchBox">
    <view class="w-100%" style="padding: 25rpx 0; background-color: #fff">
      <h3 style="margin-left: 20rpx">高血压</h3>
    </view>
    <wd-tabs v-model="tab">
      <block v-for="item in tabTitle.length" :key="item">
        <wd-tab :title="`${tabTitle[item - 1]}`"></wd-tab>
      </block>
    </wd-tabs>
    <view
      style="
        display: flex;
        flex-direction: column;
        width: 100%;
        padding: 10rpx 0;
        background-color: #fff;
      "
    >
      <text color="#00c8aa" style="margin: 45rpx">简介</text>
      <text style="margin: 45rpx">
        高血压也称血压升高，是血液在血管中流动时对血管壁造成的压力值持续高于正常的现象
        。高血压常被称为“无声的杀手”，大多数患者可在没有任何症状的情况下发病，并且血管壁长期承受着高于正常的压力会导致冠心病、脑卒中等严重疾病。
        根据最新《中国高血压防治指南》（2018年修订版）
        ，高血压定义为在未使用降压药物的情况下，有3次诊室血压值均高于正常，即诊室收缩压（俗称高压）≥140mmHg和（或）舒张压（俗称低压）≥90mmHg，而且这3次血压测量不在同一天内。
      </text>
    </view>
  </view>
</template>

<script setup lang="ts">
import TopNavigation from "@/components/TopNavigation.vue";
const tab = ref<number>(0);
const tabTitle = reactive(["简介", "症状", "诊断", "治疗", "就诊"]);
</script>

<style lang="scss" scoped>
body {
  background-color: #fff;
}
.searchBox {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  overflow: hidden;
}
.content {
  line-height: 120px;
  text-align: center;
}
</style>
